<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>iphone</title>
    <style>
        #outer {

            margin-left: 40%;
        }
        .device-ios {

            width: 360px;

            height: 640px;

            background: #111;

            border-radius: 55px;

            box-shadow: 0px 0px 0px 2px #aaa;

            padding: 105px 20px;

            position: relative;

            margin-right: 80px;

        }

        .device-ios:before {

            content: '';

            width: 60px;

            height: 10px;

            border-radius: 10px;

            position: absolute;

            left: 50%;

            margin-left: -30px;

            background: #333;

            top: 50px;

        }

        .device-ios:after {

            content: '';

            position: absolute;

            width: 60px;

            height: 60px;

            left: 50%;

            margin-left: -30px;

            bottom: 20px;

            border-radius: 100%;

            box-sizing: border-box;

            border: 5px solid #333;

        }

        .device-inner {

            background-color: #FFF;

            height: 100%;

        }
        #login{
            margin-top: 15px;
            margin-left: 32%;
            width: 180px;
            height: 30px;
            font-size: 20px;
            font-weight: 700;
            border: 0;
            background-image: linear-gradient(to right, #b8cbb8 0%, #2dcbc7 0%, #ddbaee 0%, #e8a8ee 33%, #b8d9f8 66%, #59bcf5 100%);
            border-radius: 0px;
        }
        #title
    </style>
</head>
<body>
<div class="box" >
    <div id="outer">
        <div class="device-ios" id="ios">

            <div class="device-inner">
                <div id="login">
                    <div id="tip"></div>
                    <h3>饭小美登录</h3>
                    <div class="input-box">
                        账号：<input id="uname" type="text" placeholder="请输入美信账号">
                    </div>
                    <div class="input-box">
                        密码：<input id="upass" type="password" placeholder="请输入美信密码">
                    </div>
                    <div id="error-box"><br></div>
                    <div class="input-box">
                        <button onclick="fnLogin()">登录</button>
                        <a href="resister.html">注册/Resister</a>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>

</body>
</html>